import React from "react";
import { useEffect, useState } from "react";
import { getchannelList } from "../../api/channels";
import { Select } from "antd";

const { Option } = Select;
export const Channel = () => {
  const [channels, setChannels] = useState([]);
  /* 页面加载发送请求获取表格数据进行渲染 */
  useEffect(() => {
    /* 获取频道 */
    const getchannels = async () => {
      try {
        let {
          data: { channels },
        } = await getchannelList();
        setChannels(channels);
      } catch (error) {
        console.log(error);
      }
    };
    getchannels();
  }, []);

  return (
    <div>
      <Select placeholder="请选择文章频道" style={{ width: 200 }}>
        {channels.map(item => (
          <Option key={item.id} value={item.id}>
            {item.name}
          </Option>
        ))}
      </Select>
    </div>
  );
};
